<template>
  <div>
    <el-dialog
      :append-to-body="true"
      :visible.sync="dialog"
      :title="form.title"
      width="800px">
      <div v-if="selectType===1">
        <slide :parent-data="parentData" :row-data="rowData" @fun="isPickData" @submit="submit"/>
      </div>
      <div v-if="selectType===2">
        <shelf :parent-data="parentData" :row-data="rowData" @fun="isPickData" @submit="submit"/>
      </div>
      <el-tabs
        v-if="selectType===3"
        v-model="tabTitle"
        @tab-click="handleClick">
        <el-tab-pane
          label="宝贝详情"
          name="first" >
          <doteyDetail v-if="first" :row-data="rowData" @fun="isPickData" @submit="submit"/>
        </el-tab-pane>
        <!--<el-tab-pane
          label="分类"
          name="third">
          <classify v-if="third" :row-data="rowData" @fun="isPickData" @submit="submit"/>
        </el-tab-pane>
        <el-tab-pane
          label="页面"
          name="four">
          <page v-if="four" :row-data="rowData" @fun="isPickData" @submit="submit"/>
        </el-tab-pane>-->
      </el-tabs>
    </el-dialog>
  </div>
</template>

<script>
import initData from '@/mixins/initData'
import initDict from '@/mixins/initDict'
import Treeselect from '@riophae/vue-treeselect'
import classify from '@/views/chaomall/commodity/slideshow/photoTextNavComponent/classify'
import doteyDetail from '@/views/chaomall/commodity/slideshow/photoTextNavComponent/doteyDetail'
import page from '@/views/chaomall/commodity/slideshow/photoTextNavComponent/page'
import slide from '@/views/chaomall/commodity/slideshow/photoTextNavComponent/slide'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
  components: { Treeselect, classify, page, doteyDetail, slide },
  mixins: [initData, initDict],
  props: {
    isType: {
      type: String,
      default: '0'
    },
    parentData: {
      type: Object,
      // eslint-disable-next-line vue/require-valid-default-prop
      default: {}
    },
    rowData: {
      type: Object,
      // eslint-disable-next-line vue/require-valid-default-prop
      default: {}
    }
  },
  data() {
    return {
      loading: false,
      dialog: false,
      // eslint-disable-next-line vue/no-dupe-keys
      selectType: 1,
      tabTitle: 'first',
      depts: [],
      deptId: null,
      form: {
        title: ''
      },
      imageUrl: '',
      pickData: '',
      first: true,
      second: false,
      third: false,
      four: false,
      fifty: false
    }
  },
  methods: {
    /* 点击取消事件，由子组件传过来的值确定 */
    isPickData(data) {
      this.dialog = data
    },
    /* 点击确定事件 */
    submit(data) {
      this.dialog = false
      this.$emit('fun', data)
    },
    handleClick(tab) {
      switch (tab.name) {
        case 'first':
          this.first = true
          break
        // eslint-disable-next-line eqeqeq
        case 'second':
          this.second = true
          break
        case 'third':
          this.third = true
          break
        case 'four':
          this.four = true
          break
        case 'fifty':
          this.fifty = true
          break
        default:
      }
    }
  }
}
</script>

